<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册页面</title>
    <link rel="stylesheet" href="./css/reset.css" />
    <link rel="stylesheet" href="./css/common.css" />
    <link rel="stylesheet" href="./css3/register.css" />
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>

<body>
<!-- 1.头部 -->
<div id="header">
    <!-- 1.顶部登录注册 -->
    <div class="top bgc10">
        <!-- 版心 -->
        <div class="container ce6 ti265">
            why.com
            <div class="fr">
                欢迎光临<a href="#" class="cf60">WHY</a>，请<a href="./login.html" class="ce6">登陆</a>\<a href="./register.html" class="cf60">注册</a>
            </div>
        </div>
    </div>
    <!-- 2.注册logo -->
    <div class="reglogo container rel clearfix">
        <div class="logo abs">
            <!-- 1.logo -->
            <a href="#">
                <img src="./images/素材图片/饰品/why.jpg" alt="" class=" abs">
            </a>
            <span class="abs font30 ce6">注册</span>
        </div>
        <h3 class="font30 fnormal c6">欢迎注册</h3>
        <p class="font24 ca6">已有账号？请<a href="./login.html" class="c3">登录</a></p>
    </div>
</div>

<!-- 注册表单 -->
<div id="app" class="container">
    <div id="regForm">
        <div id="regBox" >
            <span class="tips1 font22 c6">账号</span><input type="tel" id="tel" name="utele" class="reginput font16"
                                                          placeholder="请输入常用手机号">
            <span class="tips2 font22 c6">昵称</span><input type="text" id="username" name="uname"
                                                          class="reginput font16" placeholder="请设置您的昵称" >
            <span class="tips3 font22 c6">设置密码</span><input type="password" id="setpwd" name="upassword" class="reginput font16"
                                                            placeholder="建议设置两种字符密码">
            <span class="tips4 font22 c6">确认密码</span><input type="password" id="setpwdag" name="upassword2" class="reginput font16"
                                                            placeholder="再次输入密码">
            <span class="tips5 font22 c6">邮箱</span><input type="email" id="email" name="uemail" class="reginput font16"
                                                          placeholder="请输入邮箱">
            <label style="user-select:none;">
                <input type="checkbox" name="accept" id="accept">
                我已阅读并同意<a href="#" class="cf60">《WHY用户注册协议》</a>
            </label>
            <button type="submit" @click="reg" class="regBtn font26">立即注册</button>
            <div id="err" class="" style="visibility: hidden">格式有误请重新注册</div>
        </div>
    </div>
</div>

<!-- 10.页脚 -->
<div id="footer">
    <p class="btmnav container">
        <a href="#" class="font12 c3">公司简介</a>
        |
        <a href="#" class="font12 c3">Investor Relations</a>
        |
        <a href="#" class="font12 c3">网站联盟</a>
        |
        <a href="#" class="font12 c3">投资热线--05168888661</a>
        |
        <a href="#" class="font12 c3">机构销售</a>
        |
        <a href="#" class="font12 c3">欢迎加盟</a>
        |
        <a href="#" class="font12 c3">官方Blog</a>
        |
        <a href="#" class="font12 c3">热词搜索</a>
    </p>
    <p class="font12 c3">why首饰购物网@hmh.yfg.wy.888</p>
</div>
<script>
    new Vue({
        el:'#app',
        data(){
            return{
                info:null
            }
        },
        methods:{
            reg:function () {
                console.log("aaa");
                $.post("/user/register",
                    {utele: $("#tel").val(),
                        uname:$("#username").val(),
                        upassword: $("#setpwd").val(),
                        upassword2: $("#setpwdag").val(),
                        uemail: $("#email").val()
                    },

                    function (data) {
                    this.info = data;
                    if (data == "err") {
                        $("#err").css("visibility", "visible");
                    } else if (data == "ok") {
                        window.location.href = "/login.html";
                    }
                })
            }
        }
    })
</script>

</body>

</html>
